<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=5">
    <title>菜菜张 caicaizhang</title>
    <meta name="description" content="00后无为青年，后端开发者（学习者），略懂前端, 学生，实习，缺乏社会的毒打">
    <meta name="keywords" content="Java,Spring,个人博客，博客">
    <meta name="format-detection" content="telephone=no">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="static/css/index.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jquery.fancybox@2.1.5/source/jquery.fancybox.css">
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <link rel="stylesheet"  href="static/css/css-test/style.css"/> <!-- template css -->

    <script type="text/javascript">
        if (!!window.ActiveXObject || "ActiveXObject" in window) { //is IE?
            alert('朋友，上古浏览器不支持呢~');
        }
    </script>
</head>
<body>

<!-- Nav -->
<nav id="nav" >
    <ul class="skel-panels-fixed">
        <li><a href="index.html">Home</a></li>
        <li class="current_page_item"><a href="blogPage.html">Blog</a></li>
        <li><a href="ourStory.html">Our story</a></li>
        <li><a href="aboutMe.html">About me</a></li>
    </ul>
</nav>
<!-- /Nav -->

    <div id="body-wrap">

        <nav class="not_index_bg" id="nav_page" style="background-image:url(https://source.unsplash.com/random)">
            <!--https://api.ixiaowai.cn/api/api.php-->
            <div id="page_site-info">
                <div id="site-title">
                    <span class="blogtitle"></span>
                    <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>
                    <script>
                        var typed = new Typed(".blogtitle", {
                            strings: ['自强不息，知行合一', 'Manners makes man'],<!--求知若饥，虚心若愚,Stay Hungry Stay Foolish-->
                            startDelay: 300,
                            typeSpeed: 100,
                            loop: true,
                            backSpeed: 50,
                            showCursor: true
                        });
                    </script>
                </div>
            </div>
        </nav>

        <main id="content-outer">
            <div class="layout_page" id="content-inner">

                <!--Right Content-->
                <!--About Section-->
                <div class="aside_content" id="aside_content">
                    <div class="card-widget card-info">
                        <div class="card-content">
                            <div class="card-info-avatar is-center">
                                <img class="avatar-img"
                                     src="https://cdn.jsdelivr.net/gh/laoxuai/assert/images/20200125221102.png"
                                     alt="avatar">
                                <div class="author-info__name">ZhangYH</div>
                                <div class="author-info__description">00后无为青年，后端<s>开发者</s>(学习者)，略懂前端，学生，<s>实习</s>，缺乏社会的毒打</div>
                            </div>
                            <div class="card-info-social-icons is-center">
                                <a class="social-icon" href="https://github.com/sun-flower-free" target="_blank">
                                    <i class="fa fa-github"></i>
                                </a>
                            </div>
                        </div>
                    </div>

                    <div class="card-widget card-announcement">
                        <div class="card-content">
                            <div class="item-headline">
                                <i class="fa fa-bullhorn" aria-hidden="true"></i>
                                <span>一言</span>
                            </div>
                            <div id="hitokoto"></div>
                        </div>
                    </div>
                    <div class="card-widget card-announcement">
                        <div class="card-content">
                            <div class="item-headline">
                                <i class="fa fa-calendar" aria-hidden="true"></i>
                                <span>今日诗词</span>
                            </div>
                            <div id="jinrishici-sentence"></div>
                        </div>
                    </div>

                    <div class="card-widget card-webinfo">
                        <div class="card-content">
                            <div class="item-headline">
                                <i class="fa fa-line-chart" aria-hidden="true"></i>
                                <span>站点信息</span>
                            </div>
                            <div class="webinfo">
                                <div class="webinfo-item">
                                    <div class="webinfo-site-uv-name">本站访客数 :</div>
                                    <div class="webinfo-site-uv-count" id="busuanzi_value_site_uv"></div>
                                </div>
                                <div class="webinfo-item">
                                    <div class="webinfo-site-name">本站总访问量 :</div>
                                    <div class="webinfo-site-pv-count" id="busuanzi_value_site_pv"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!--Blog Content-->
                <div id="blog" class="content col-md-12">
                    <div class="row">
                        <div class="page-title">
                            <h2>Blog Posts </h2>
                        </div>
                        <div class="col-md-12 page">
                            <!--Blog Post -->
                            <div class="col-md-12 blog-post">
                                <div class="post-image">
                                    <img src="static/images/post-2.jpg" alt="">
                                </div>
                                <div class="post-title">
                                    <h1>Working principle, how do we work?</h1>
                                </div>
                                <div class="post-info">
                                    <span>December 06, 2016 / Business, Company / 2 Comments</span>
                                </div>
                                <p>Blanditiis dapibus, aliquet ullam in ut, conubia turpis dolore vivamus ligula deserunt, vehicula praesent iure? Magni? Porta minus pariatur ante dolore, veniam cubilia urna? Eligendi commodo fugiat voluptate, rerum orci neque voluptatem cum repellendus exercitation pellentesque.</p>
                                <a href="single-blog.html" class="but-big">LOAD MORE</a>
                            </div>
                            <!--Blog Post -->
                            <div class="col-md-12 blog-post">
                                <div class="post-image">
<!--                                    <iframe src="https://player.vimeo.com/video/99125930?title=0&byline=0&portrait=0" width="100%" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>-->
                                    <iframe src="static/images/name.jpg" width="100%" height="360" ></iframe>
                                </div>
                                <div class="post-title">
                                    <h1>Working principle, how do we work?</h1>
                                </div>
                                <div class="post-info">
                                    <span>December 06, 2016 / Business, Company / 2 Comments</span>
                                </div>
                                <p>Blanditiis dapibus, aliquet ullam in ut, conubia turpis dolore vivamus ligula deserunt, vehicula praesent iure? Magni? Porta minus pariatur ante dolore, veniam cubilia urna? Eligendi commodo fugiat voluptate, rerum orci neque voluptatem cum repellendus exercitation pellentesque.</p>
                                <a href="single-blog.html" class="but-big">LOAD MORE</a>
                            </div>
                            <!--Blog Post -->
                            <div class="col-md-12 blog-post">
                                <div class="post-image">
                                    <iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/275486953&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
                                </div>
                                <div class="post-title">
                                    <h1>Working principle, how do we work?</h1>
                                </div>
                                <div class="post-info">
                                    <span>December 06, 2016 / Business, Company / 2 Comments</span>
                                </div>
                                <p>Blanditiis dapibus, aliquet ullam in ut, conubia turpis dolore vivamus ligula deserunt, vehicula praesent iure? Magni? Porta minus pariatur ante dolore, veniam cubilia urna? Eligendi commodo fugiat voluptate, rerum orci neque voluptatem cum repellendus exercitation pellentesque.</p>
                                <a href="single-blog.html" class="but-big">LOAD MORE</a>
                            </div>


                            <!--footer-->
                            <footer class="footer"> <p>  Copyright © 2016 All right reserved </p></footer>

                        </div><!-- .col-md-12 .page -->
                    </div><!--.row end-->
                </div> <!-- #blog .content .col-md-12 end -->
            </div>
        </main>

        <footer id="footer">
            <div id="footer-wrap">
                <div class="copyright">&copy;2021 - 2021 BY ZhangYH</div>
            </div>
        </footer>

    </div>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/jquery.fancybox@2.1.5/source/jquery.fancybox.js"></script>
    <script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/instant.page@3.0.0/instantpage.js" type="module"></script>
    <script src="https://cdn.jsdelivr.net/npm/lazysizes@5.2.0/lazysizes.min.js" async></script>

    <!--   一言、今日诗词   -->
    <script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>
    <script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>

    <!--鼠标点击效果-->
    <script src="https://cdn.jsdelivr.net/gh/TRHX/CDN-for-itrhx.com@3.0.8/js/maodian.js"></script>
</body>
</html>
